% # variable:
% # bookshelf, bookuuid, current_uuid, record_name, info, eznav_level, stnav_level, page_type

% import xml.etree.ElementTree as ET

% # 國際化
% import lonote.translate
% g = lonote.translate.get_gettext_func()


% # 整理並抽取基本資料
% if page_type == 'content':
    % try:
        % book = bookshelf.findbook(bookuuid)
        % bookxml = book.book_xml()
        % ebook = ET.fromstring(bookxml)

        % enote = ebook.find('.//note[@uuid="{}"]'.format(current_uuid))
        % if enote is None and bookuuid == current_uuid:
            % enote = ebook
        % end

        % # enote 存在（有效），則計算與歷史記錄有關的項目
        % if enote is not None:
            % mtime = book.mtime(current_uuid)
            % ehistory = bookshelf.ehistory(bookuuid, current_uuid)
        % end
    % except:
        % book = None
        % ebook = None
        % enote = None
    % end
% end


<aside id="sidebar">

    <nav id="pagenav">
        <!-- eznav -->
        % if page_type == 'content':
            % include ez_nav book = book, ebook = ebook, target_uuid = current_uuid, max_level = eznav_level
        % else:
            <ul class="menuroot">
                % title_text = g('Back to the note page which your browsing before.')
                <li><a href="/last" title="{{title_text}}" target="">{{!g('Back')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/move.svg"></span></a>
            </ul>
        % end

        <!-- Nav -->

        % if page_type != 'index':
            <ul class="menuroot">
                % title_text = g('All notes are list in here.')
                <li class="stnav"><a href="/index" title="{{title_text}}" target="">{{!g('Bookshelf')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/index.svg"></span></a>
                <ul>
                    % ebooks = bookshelf.ebooks()
                    % for ebook in ebooks:
                        % if bookuuid is not None and ebook.get('uuid') == bookuuid:
                            % include nav_item book = bookshelf.findbook(ebook.get('uuid')), eroot = ebook, bookuuid = ebook.get('uuid'), target_uuid = current_uuid, max_level = stnav_level, trace_path_enable = True
                        % else:
                            % include nav_item book = bookshelf.findbook(ebook.get('uuid')), eroot = ebook, bookuuid = ebook.get('uuid'), target_uuid = current_uuid, max_level = stnav_level, trace_path_enable = False
                        % end
                    % end
                </ul>
            </ul>
        % end
    </nav>
    <hr />

    <nav id="commandnav">
        <!-- Configure Menu -->
        <ul class="menuroot">
            % title_text = g('Configure & Manage your LoNote server.')
            <li><a href="/config" title="{{title_text}}">{{!g('Configure')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/config.svg"></span></a>
                <ul>
                    % if page_type == 'content':
                        % title_text = g('Configure & Manage this book.')
                        <li><a href="/config/book/{{!bookuuid}}" title="{{title_text}}">{{!g('Configure This Book')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/config.svg"></span></a></li>
                    % end
                    % title_text = g('Check Hotkey table.')
                    <li><a href="/hotkey" title="{{title_text}}" target="_blank">{{!g('Hot Key')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/hotkey.svg"></span></a></li>
                    <!-- <li><a href="/start" title="Beginner start page.">How to Start<span class="notify"><img class="icon" src="/static/icon/sidebar/howtostart.svg"></span></a></li> -->
                    % title_text = g('Check about the LoNote Project')
                    <li><a href="{{!info.homepage}}" title="{{title_text}}" target="_blank">{{!g('About LoNote')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/about.svg"></a></span>
                        <ul>
                            % title_text = g('Check the LoNote\'s Changelog')
                            <li><a href="{{!info.changelogpage}}" target="_blank" title="{{title_text}}">{{!g('Version: ')}}<b>{{!info.version}}</b></a></li>
                            % title_text = g('Check or submit your bugs or feature request.')
                            <li><a href="{{!info.bugpage}}" target="_blank" title="{{title_text}}"><b>{{!g('Bug Report')}}</b></a></li>
                            % title_text = g('Talk something about LoNote.')
                            <li><a href="{{!info.forumpage}}" target="_blank" title="{{title_text}}"><b>{{!g('Forum')}}</b></a></li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>

        <!-- 歷史記錄 -->
        % if page_type == 'content':
            <hr />
            % include record_menu ehistory = ehistory, mtime = mtime, record_name =record_name
        % end

        <!-- 編輯／瀏覽按鈕 -->
        % if page_type == 'content':
            <ul class="menuroot">
                % title_text = g('toggle by click')
                <li><a id="content-mode" title="{{title_text}}"></a>
                    <ul>
                        % title_text = g('Show this page as a complete HTML page include CSS and other things, but no sidebar and edit function.')
                        <li><a href="?mode=html" title="{{title_text}}">{{!g('HTML Mode')}}</a></li>
                        % title_text = g('Show only the pure content which you edited in this page.')
                        <li><a href="?mode=raw" title="{{title_text}}">{{!g('Raw Mode')}}</a></li>
                    </ul>
                </li>
            </ul>
        % end


        <!--功能選單面板-->
        % if page_type == 'content':
            <hr />
            <div id="cmdpanel">
                <ul class="menuroot">
                    % title_text = g('Save as the current version.')
                    <li id="btn_content_update"><a title="{{title_text}}">{{!g('Save')}}<span class="notify"><span class="response_notify"></span><img class="icon" src="/static/icon/sidebar/save.svg"></span></a>
                        <ul>
                            % title_text = g('Create a new note')
                            <li id="btn_note_create"><a title="{{title_text}}">{{!g('New Note')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/newnote.svg"></span></a></li>
                            % title_text = g('Change the title.')
                            <li id="btn_title_update"><a title="{{title_text}}">{{!g('Change Title')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/changetitle.svg"></span></a></li>
                            % title_text = g('Move the current note position.')
                            <li id="btn_position_update"><a title="{{title_text}}">{{!g('Move')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/move.svg"></span></a></li>
                            % title_text = g('Freeze the current version as a record.')
                            <li id="btn_make_record"><a title="{{title_text}}">{{!g('Freeze Version')}}<span class="notify"><span class="response_notify"></span><img class="icon" src="/static/icon/sidebar/version.svg"></span></a></li>
                            % title_text = g('Clear (embedded) resources which not appear in current or any records content.')
                            <li id="btn_clear_unused_embedded"><a title="{{title_text}}">{{!g('Clear Unused Resource')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/clearunusedemb.svg"></span></a></li>
                            % title_text = g('Delete the current page.')
                            <li id="btn_note_delete"><a title="{{title_text}}">{{!g('Recycle')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/recycle.svg"></span></a></li>
                            % title_text = g('Export the current page (and all sub pages) as a new Notebook.')
                            <li id="btn_note_export"><a title="{{title_text}}">{{!g('Export')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/export.svg"></span></a></li>
                            <!-- <li id="btn_book_import" title="Import a existing notebook as sub-page of current note."><a>Import<span class="notify"><img class="icon" src="/static/icon/sidebar/import.svg"></span></a></li> -->
                        </ul>
                    </li>

                    <!-- 資源列表 -->
                    % title_text = g('All page resource are listed here...')
                    <li id="resource_list"><a title="{{title_text}}" style="cursor: default;">{{!g('Resource')}}<span class="notify"><img class="icon" src="/static/icon/sidebar/resource.svg"></span></a>
                        <ul>
                            % resource_list = book.resource_list(current_uuid)
                            % for resource in resource_list:
                                %if resource.get('res_type') == 'emb':
                                    %icon = ' <img class="icon" src="/static/icon/sidebar/emb.svg">'
                                %elif resource.get('res_type') == 'att':
                                    %icon = ' <img class="icon" src="/static/icon/sidebar/att.svg">'
                                %else:
                                    %icon = ''
                                %end
                                <li res_name="{{resource.get('name')}}"><a class="resource_link" href="{{resource.get('name')}}" title="" target="_blank"><span class="notify-small">{{!icon}}</span>{{resource.get('name')}}</a>
                                    <ul>
                                        % title_text = g('Delete: <b>{}</b>').format(resource.get('name'))
                                        <li onclick="lo.noteop.resource_del_dia('{{resource.get("name")}}');"><a title="{{title_text}}">{{!g('delete')}}</a></li>
                                    </ul>
                                </li>
                            %end
                        </ul>
                    </li>
                </ul>
            </div>
        %end

        <!-- index Mode Changed -->
        % if page_type == 'index':
            <hr/>

            <ul class="menuroot">
                % def get_class(it, mode):
                    % if it == 'html' and mode == 'html':
                        % return 'target'
                    % elif it == 'raw' and mode == 'raw':
                        % return 'target'
                    % elif it == 'standard' and (not mode == 'raw') and (not mode == 'html'):
                        % return 'target'
                    % else:
                        % return ''
                    % end
                % end
                % title_text = g('Access general LoNote page.')
                <li><a href="index" title="{{title_text}}" class="{{get_class('standard', mode)}}">{{!g('Standard Mode')}}</a>
                % title_text = g('Access HTML page directly.')
                <li><a href="index?mode=html" title="{{title_text}}" class="{{get_class('html', mode)}}">{{!g('Html Mode')}}</a>
                % title_text = g('Access RAW page directly.')
                <li><a href="index?mode=raw" title="{{title_text}}" class="{{get_class('raw', mode)}}">{{!g('Raw Mode')}}</a>
            </ul>
        % end

    </nav>


    <script>
        // 掛載 sidebar 所需的功能
        lo.sidebar.ready();
    </script>

    <script>
        $('#pagenav').tooltip({
            show: false,
            hide: false,
            position: { my: "left+15 top+15", at: "right bottom", collision: "flipfit" },
            content: function() {
                var title = $(this).attr('title');
                var h_list = $(this).parents().filter('li');
                var v_list = h_list.last().find(' ~ li');
                var v_texts = [];
                v_list.children('a').each(function(){v_texts.push($(this).text())});
                h_list = h_list.not('.stnav')
                var h_texts = [];
                h_list.children('a').each(function(){h_texts.push($(this).text())});
                h_texts.reverse();
                h_texts.pop();
                h_texts.reverse();
                // alert(v_texts.join(','));
                // alert(h_texts.join(','));
                var flowtext = $.merge(h_texts, v_texts).join(' ← ');
                flowtext = ' ← ' + flowtext;
                ans = '<b>' + $(this).text() + '</b><span style="font-size: smaller">' + flowtext + '</span><hr/>' + title;
                return ans;
            }
        });

        $('#commandnav').tooltip({
            show: false,
            hide: false,
            position: { my: "left+15 top+15", at: "right bottom", collision: "flipfit" },
            content: function() {
                var title = $(this).attr('title');
                var text = $(this).text();
                var ans = '<span style="font-size: smaller; font-style: italic;">' + text + '</span><hr/>' + title;
                return ans;
            }
        });

        $('#current_version').tooltip({
            show: false,
            hide: false,
            position: { my: "left+15 top+15", at: "right bottom", collision: "flipfit" }
        });

        $('.resource_link').tooltip({
            show: false,
            hide: false,
            track: true,
            position: { my: "left+15 top+15", at: "right bottom", collision: "flipfit" },
            content: function() {
                var path = $(this).attr('href');
                var ans = '';
                if(path.search(/\.(?:jpg|jpeg|gif|png|bmp|svg|webp)$/i) != -1){
                    ans = '<span style="font-size: smaller; font-style: italic;">' + path + '</span><hr/><img style="max-width: 200px; max-height: 200px;" src="' + path + '"/>';
                } else {
                    ans = '<span style="font-size: smaller; font-style: italic;">' + path + '</span>';
                }
                return ans;
            }
        });

    </script>


</aside>
